package com.huluobo.a2211mdmdemo

import android.util.Log
import androidx.compose.foundation.Image
import androidx.compose.foundation.background
import androidx.compose.foundation.border
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.offset
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Lock
import androidx.compose.material.icons.filled.Send
import androidx.compose.material3.Button
import androidx.compose.material3.ElevatedButton
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.Icon
import androidx.compose.material3.OutlinedButton
import androidx.compose.material3.OutlinedIconButton
import androidx.compose.material3.OutlinedTextField
import androidx.compose.material3.Text
import androidx.compose.material3.TextButton
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.res.colorResource
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.text.input.PasswordVisualTransformation
import androidx.compose.ui.text.input.VisualTransformation
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.text.style.TextOverflow
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import coil.compose.AsyncImage

/**
 *  Created by LC on 2025/4/23.
 */


@Composable
fun MyTextView() {
    //横向布局
    Row(
        //装饰器,一般控件的属性都在装饰器中,所有控件的装饰器写法都一致
        modifier = Modifier
            //占全屏的宽
            .fillMaxWidth()
            //内边距,注意compose中dp只接收20.dp的写法
            .padding(20.dp)
            //背景,颜色形状相关的都在背景中
            .background(Color.White, RoundedCornerShape(20.dp)),
        //横向间隔,一般可选SpaceAround(平均分),或者SpaceBeTween(首尾占两头,其他平均分),spacedBy(间隔xxx.dp)
        horizontalArrangement = Arrangement.spacedBy(20.dp),
        //纵向对齐,注意横向布局中只有纵向对齐,纵向布局中只有横向对齐
        verticalAlignment = Alignment.CenterVertically
    ) {
        Text(text = "LC",
            //点击事件
            modifier = Modifier.clickable {
                Log.i("TagA", "点击了Text")
            })
        Text(
            //文本
            text = "LC1231231232311111111",
            //文本对齐
            textAlign = TextAlign.Center,
            //颜色,
            color = colorResource(id = R.color.red),
            //字体大小
            fontSize = 22.sp,
            //字重
            fontWeight = FontWeight.Bold,
            //字符间隔
            letterSpacing = 13.sp,
            //最大行数
            maxLines = 1,
            //超出范围后
            overflow = TextOverflow.Ellipsis
        )
        Text(text = "LC")
        Text(text = "LC")
    }
}

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun MyColumn() {
    var name by remember {
        mutableStateOf("")
    }

    var pass by remember {
        mutableStateOf("")
    }

    var isShowPass by remember {
        mutableStateOf(true)
    }
    Column(modifier = Modifier.padding(20.dp), verticalArrangement = Arrangement.spacedBy(20.dp)) {
//        TextField(
//            //输入的值
//            value = name,
//            //当输入值改变时,it就是当前输入框中的值
//            onValueChange = { name = it },
//            label = {
//                Text(text = "请输入用户名")
//            }, leadingIcon = {
//                //Icon有3种形式,Vector 是直接添加系统自带的图标
//                Icon(imageVector = Icons.Default.AccountCircle, contentDescription = "")
//                //painter 是添加Drawable中的图标,使用painterResource来获取drawable文件夹
////                Icon(painter = painterResource(id = R.drawable.ic_launcher_background), contentDescription ="" )
//                //第三种接受bitmap,不常用
////                Icon(bitmap = , contentDescription = )
//            }, trailingIcon = {
//                Icon(imageVector = Icons.Default.Lock, contentDescription = "", Modifier.clickable {
//                })
//            })

        OutlinedTextField(value = pass, onValueChange = { pass = it }, label = {
            Text(text = "请输入密码")
        }, trailingIcon = {
            Icon(imageVector = Icons.Default.Lock, contentDescription = "", modifier = Modifier.clickable {
                isShowPass = !isShowPass
            })
        }, visualTransformation = if (isShowPass) PasswordVisualTransformation() else VisualTransformation.None)
    }
}

@Composable
fun MyButton() {
    Column(Modifier.padding(20.dp), verticalArrangement = Arrangement.spacedBy(10.dp)) {
        Button(onClick = {
            Log.i("TagA", "点击了按钮")
        }) {
//            Icon(imageVector = Icons.Default.Add, contentDescription = "")
            Text(text = "登录")
        }

        OutlinedButton(onClick = {

        }) {
            Text(text = "OutlinedButton")
        }

        ElevatedButton(onClick = {}) {
            Text(text = "ElevatedButton")
        }

        TextButton(onClick = {}) {
            Text(text = "TextButton")
        }
        OutlinedIconButton(onClick = {}) {
            Text(text = "OutlinedIconButton")
        }
    }
}

@Composable
fun MyImage() {
    Column(Modifier.padding(10.dp), verticalArrangement = Arrangement.spacedBy(20.dp)) {
        Image(painter = painterResource(id = R.drawable.sign), contentDescription = "")
        Image(imageVector = Icons.Default.Send, contentDescription = "")

        AsyncImage(
            model = "https://img1.baidu.com/it/u=4214113141,2036563917&fm=253&app=120&size=w931&n=0&f=JPEG&fmt=auto?sec=1729098000&t=0662d2b383091882ccdd43ad060de2a7",
            contentDescription = "",
            modifier = Modifier
                .size(100.dp)
                .clip(CircleShape),
            contentScale = ContentScale.Crop
        )
    }
}

@Composable
fun MyBox() {
    Box(modifier = Modifier.padding(10.dp), contentAlignment = Alignment.TopEnd) {
        Text(
            text = "hello", modifier = Modifier
                .background(Color.Yellow, RoundedCornerShape(10.dp))
                .border(1.dp, Color.Blue, RoundedCornerShape(10.dp))
                .padding(vertical = 5.dp, horizontal = 10.dp)
        )
        Text(
            text = "1",
            color = Color.White,
            textAlign = TextAlign.Center,
            fontSize = 8.sp,
            modifier = Modifier
                .size(16.dp)
                .offset(3.dp, (-3).dp)
                .background(
                    Color.Red,
                    CircleShape
                )
                .padding(3.dp)
        )
    }
}